<template>
	<view class="information information-index" style="width: 750rpx;min-height: 100vh;background-color: rgb(220, 210, 190); padding: 0 25rpx;">
		<!-- 资讯 列表 -->
		<view class="active-list"
			  style="width: 700rpx;">
			<view v-for="item in data" :key="item.advPlatinfosId" @click="checkInfo(item.advPlatinfosId)">
				<!-- 列表项 -->
				<view class="active-list-item flex-row" style="width: 100%;height: 100px;border-bottom: 1px solid #aaa;">
					<!-- 左边图片 -->
					<view class="active-list-item-image" style="width: 100px;height: 80px;">
						<image :src="baseUrl+item.photoimage" style="width: 80px;height: 80px;"></image>
					</view>
					<!-- 右边内容 -->
					<view class="active-list-item-right flex-column" style="flex: 1; height: 80px; align-items: flex-start;">
						<!-- 标题 -->
						<view class="item-right-content" style="height: 60px; font-weight: 550;">
							{{item.title}}
						</view>
						<!-- 底部 -->
						<view class="item-right-bottom flex-row" style="width: 100%; height: 20px; font-size: 12px;color: #aaa;">
							<!-- 浏览量-->
							<!-- <view class="bottom-read">
								<text class="bottom-read-text">浏览量 1314</text>
							</view> -->
							<!-- 时间-->
							<view class="bottom-data">
								<text class="bottom-data-good">
									{{formatDateTime(item.pubDatetime)}}
								</text>
							</view>
							<text class="bottom-good">
								赞 {{item.plikes}}
							</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
	<view v-if="isGetMore" class="bottom-notice" style="box-sizing: border-box;width: 750rpx;height: 40px;">
		<view class="text" style="box-sizing: border-box; width: 700rpx;height: 20px;margin: 10px auto;
								  line-height: 20px;font-weight: bold;
								  text-align: center;">
			{{bottomNotice}}
		</view>
	</view>
</template>

<script>
	import { loginSystem } from '/api/login.js'
	import { BASE_URL, BASE_IMAGE_URL } from '/utils/CommonValues.js'
	export default {
		data() {
			return {
				token: '',
				type: '', // 查看的资讯类型
				data: [], // 数据
				pageSize: 10, // 取的数据长度
				pageNum: 1, // 取的数据页数
				bottomNotice: '加载更多中...',
				isGetMore: false, // 是否在加载更多
			}
		},
		onReachBottom() {
			console.log("已经到达底部了")
			// 到达底部重新继续加载数据
			this.getActive();
		},
		onLoad(option) {
			this.pageNum = 1;
			this.data = [];
			this.baseUrl = BASE_IMAGE_URL;
			this.type = option.type;
			switch(this.type) {
				case '1': uni.setNavigationBarTitle({
					title: '轮播资讯'
				}); break;
				case '2': uni.setNavigationBarTitle({
					title: '广告资讯'
				}); break;
				case '3': uni.setNavigationBarTitle({
					title: '禅意动态'
				}); break;
				case '4': uni.setNavigationBarTitle({
					title: '平台通知'
				}); break;
			}
			loginSystem().then(data => {
				this.token = data;
				this.getActive();
			})
		},
		methods: {
			formatDateTime(isoString) {
			  // const date = new Date(isoString);
			  // const options = { year: 'numeric', month: '2-digit', day: '2-digit', hour: '2-digit', minute: '2-digit', second: '2-digit' };
			  // const formatter = new Intl.DateTimeFormat('zh-CN', options);
			  // return formatter.format(date);
			   return isoString.replace('T', '  ')
			},
			// 资讯数据查询
			getActive() {
				if(this.pageNum > 1) {
					this.isGetMore = true;
				}
				console.log(this.pageNum, "页码", this.pageSize, "大小")
				//  ?pageNum=${this.pageNum}&pageSize=${this.pageSize}
				uni.request({
					url: `${BASE_URL}/system/platinfos/list`,
					method: 'GET',
					data: {
						infoSection: this.type,
						pageNum: this.pageNum,
						pageSize: this.pageSize,
						reasonable: false
					},
					dataType: 'json',
					header: {
						"Content-Type": "application/json;charset=utf-8",
						"Authorization": this.token
					},
					success: (response) => {
						// 如果请求成功，解析响应数据并调用 resolve  
						if (response.data && response.statusCode === 200) { 
							console.log(response.data);
							if(response.data.rows.length == 0) {
								this.bottomNotice = "没有更多了..."
								setTimeout(() => {
									this.isGetMore = false;
								}, 1500)
							} else {
								this.data.push(...response.data.rows);
								this.pageNum = +this.pageNum + 1;
								this.isGetMore = false;
							}
							
						} else {  
							uni.showToast({
								title: '查询失败',
								icon: 'none'
							})
						}
					},
					fail: (error) => {
						uni.showToast({
							title: '查询失败',
							icon: 'none'
						})
					}
				})
			},
			// 跳转到资讯详情
			checkInfo(id) {
				uni.navigateTo({
					url: '/pages/index/informationDetails/informationDetails?id='+id
				})
			}
		}
	}
</script>

<style lang="less">
.information{
	box-sizing: border-box;
}
.advert {
	width: 750rpx;
	height: 200px;
}
.advert-img {
	width: 100%;
	height: 100%;
}
.advert-img-logo {
	width: 100%;
	height: 100%;
	margin-left: auto;
	margin-right: auto;
}
</style>
